<template>
    <div>{{ count }}</div>
    <!-- 1. 内联语句 -->
    <button v-on:click="count++">+1</button>
    <!-- 2. 无参方法 -->
    <button v-on:click="addNoAtt">+1</button>
    <!-- 3. 有参方法 -->
    <button v-on:click="addExistAtt(3)">+3</button>

    <!-- eg: 简写 -->
    <button @click="addExistAtt(5)">+5</button>

</template>

<script setup>
    import { ref } from 'vue';
    const addNoAtt = () => {
        count.value++
    }

    const addExistAtt = n => {
        count.value += n
    }

    const count = ref(0)
</script>

<style scoped>

</style>